<template>
  <div id="player" ></div>
  <LoadingForUE ref="loadingForUERef"></LoadingForUE>
</template>

<script setup lang="ts">
import cloudRenderer from "uesuperapi";
import { orderForRender } from "../../api/render";
import { useRouter,useRoute } from 'vue-router'

import LoadingForUE from "@/components/LoadingForUE/index.vue";

const router = useRouter()
const route = useRoute()
const loadingForUERef=ref();

let CloudRender: any;
let timer: any;
onMounted(() => {
	
	console.log(route.query.id)

	loadingForUERef.value.show('维华合众')	
	
	
  CloudRender = new cloudRenderer("player", 0);
  timer = setTimeout(() => {
    orderForRender({
      appid: route.query.id,
      resX: window.innerWidth,
      resY: window.innerHeight,
    }).then((rsp: any) => {
      console.log("rsp", rsp);
      if (rsp.code == 200) {
        const url = rsp.result.url;
		loadingForUERef.value.change(50)	
        CloudRender.SuperAPI("loadCompleteResponse", (e: any) => {
          console.log(e);
		  loadingForUERef.value.complete()	
        });
        CloudRender.SuperAPI("StartRenderCloud", url);
      }
    });
  }, 200);
});
onBeforeUnmount(() => {
  clearTimeout(timer);
});
</script>

<style scoped>
#player {
  width: 100%;
  height: 100%;
  pointer-events: auto;
}
</style>
